<template>
	<view>
		<view class="top-view" :style="{height:CustomBarRpx +'rpx',paddingTop:StatusBarRpx+'rpx'}">
			<view class="sub-view">
				<view class="sub-view-left">
					<image @click="back"
						src="https://img.alicdn.com/imgextra/i1/2215984279448/O1CN01WtjUbX2JfEt5T8vhI_!!2215984279448.png"
						mode="" class="back-img" v-if="isShowDOM"></image>
				</view>
				<view class="sub-view-center">
					{{boxInfo.title}}
				</view>
				<view class="sub-view-right"></view>
			</view>
		</view>
		<view :style="{height:CustomBarRpx+'rpx'}"> </view>
		<view class="header-view" style="height:350px">
			<view class="music-view" @click="playMusic">
				<image
					src="https://img.alicdn.com/imgextra/i4/2215984279448/O1CN014cNwsq2JfEst8SjEs_!!2215984279448.png" mode="aspectFit"
					v-if="!muteBgMusic"></image>
				<image v-if="muteBgMusic"
					src="https://img.alicdn.com/imgextra/i2/2215984279448/O1CN01WRv3GN2JfEt2zC1KS_!!2215984279448.png" mode="aspectFit">
				</image>
			</view>
			<view class="banner" v-if="isShowDOM">
				<view class="boxInfo_img">
					<image 
						:src="boxInfo.footer_image" 
						@click="previewImage(boxInfo.footer_image, boxInfo.title, boxInfo.price + '/抽')"
						mode="aspectFit" class="gd-img"></image>
				</view>
			</view>
			<view class="g-info-price">
				￥{{boxInfo.price}}/抽
			</view>
		</view>
		<view class="view_pages">
			<view class="view_prev">
				<u-button type="primary" @click="get_boxinfo('prev')" :plain="true" size="mini">
					<u-icon name="arrow-left" color="#2979ff" size="28"></u-icon>上一个
				</u-button>
			</view>
			<view class="view_page_total">
				当前箱号：<view><text style="color: #876af2;">{{box_info_page}}</text><text style="color: #999;">/{{box_info_pagesize}}</text></view>
			</view>
			<view class="view_goods_total">
				余量/总数：<view><text style="color: #876af2;">{{goods_stock}}</text><text style="color: #999;">/{{goods_stock_total}}</text></view>
			</view>
			<view class="view_next">
				<u-button type="primary" @click="get_boxinfo('next')" :plain="true" size="mini">
					下一个
					<u-icon name="arrow-right" color="#2979ff" size="28"></u-icon>
				</u-button>
			</view>
		</view>
		<u-gap height="10" ></u-gap>
		<view class="view_tabs">
			<u-subsection 
				bg-color="#37003F" 
				active-color="#fff" 
				button-color="#998df6" 
				inactive-color="#fff" 
				@change="changTabs"
				:list="tabs_list" :current="current_index"></u-subsection>
		</view>
		<view v-if="current_index == 0" class="view_tabs_div view_tabs_one">
				<template v-for="item in blind_box_odds">
					<view class="goods_level" v-for="(r_sm,r_idx) in  item.goods_list" :key="r_sm.id">
						<view class="c-item-banner-box"  >
							<view class="back-img">
								<view class="g_level g_level_text">{{item.title}}</view>
								<image :src="r_sm.goods_image" 
									@click="previewImage(r_sm.goods_image, r_sm.goods_title_text, (r_sm.goods_price*1).toFixed(1))"
									style="height: 220rpx; width: 100%;" mode="aspectFill"></image>
								<view v-if="r_sm.stock <= 0" @click="previewImage(r_sm.goods_image, r_sm.goods_title_text, (r_sm.goods_price*1).toFixed(1))" class="mask_bg">
									<image 
										style="width: 69rpx; height:110rpx"
										src="https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240912/f8b36e6df69a483e5138794fe031336b.png"  
										class="mask-img" mode="aspectFit"></image>
								</view>
								<view class="g_nums">
									剩余：<view>{{r_sm.stock}}/{{r_sm.stock_total}}</view>
								</view>
							</view>
							<view class="goods_text">
								<view class="g_title">{{r_sm.goods_title_text}}</view>
								<view class="g_price">￥{{ (r_sm.goods_price*1).toFixed(1)}}</view>
							</view>
							<view v-if="r_sm.stock <= 0" class="g_rate">
								概率：<view>0.00%</view>
							</view>
							<view v-else-if="r_sm.goods_odds > 0"  class="g_rate">
								概率：<view>{{r_sm.goods_odds}}%</view>
							</view>
							<view v-else class="g_rate">
								概率：<view>{{item.rate}}%</view>
							</view>
						</view>
						
					</view>
				
			</template>
		</view>
		<view v-if="current_index == 1" class="view_tabs_div view_tabs_two">
			<view class="view_pages2">
				<view class="view_prev">
					<u-button type="primary" @click="get_openlogs('prev')" :plain="true" size="mini">
						<u-icon name="arrow-left" color="#2979ff" size="28"></u-icon>上一页
					</u-button>
				</view>
				<view class="view_page_total" style="font-size: 24rpx;">
					<view>
						共<text style="color: #999;">{{log_total_page}}</text>页，
						第<text style="color: #876af2;">{{log_page}}</text>页
					</view>
				</view>
				<view class="view_next">
					<u-button type="primary" @click="get_openlogs('next')" :plain="true" size="mini">
						下一页
						<u-icon name="arrow-right" color="#2979ff" size="28"></u-icon>
					</u-button>
				</view>
			</view>
			<view class="pk_list" v-for="(item,z) in tongList">
				<image
					v-if="item.win == 'side_left'"
					title="赢"
					src="https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240921/e2abcb1b0409ea620d9376f68b922f76.png"  
					class="pk_result pk_result_left" mode="aspectFit"></image>
				<image
					v-else
					title="输"
					src="https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240921/87e05926569d3b1cdf25ab300aa03b39.png"  
					class="pk_result pk_result_left" mode="aspectFit"></image>
				
				<image
					v-if="item.win == 'side_right'"
					title="赢"
					src="https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240921/e2abcb1b0409ea620d9376f68b922f76.png"  
					class="pk_result pk_result_right" mode="aspectFit"></image>
				<image
					v-else
					title="输"
					src="https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240921/87e05926569d3b1cdf25ab300aa03b39.png"  
					class="pk_result pk_result_right" mode="aspectFit"></image>	
				
				<view class="pk_header">
					<image
						src="https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240921/7e369c19b31ef481835a83e1c88eaad1.png"  
						class="mask-img" mode="aspectFit"></image>
					<view class="pk_left_member">
						<image
							:src="item.member_left.user_img"  
							class="u-img" mode="aspectFit"></image>
						{{item.member_left.username}}
					</view>
					<view class="pk_right_member">
						{{item.member_right.username}}
						<image
							:src="item.member_right.user_img"  
							class="u-img" mode="aspectFit"></image>
					</view>
				</view>
				<view class="pk_create">
					<view class="arrow_right"></view>
					<view class="pk_create_text">开奖时间：{{$u.timeFormat(item.win_time, 'yyyy-mm-dd hh:MM:ss')}}</view>
					<view class="arrow_left"></view>
				</view>
				<view class="pk_num">
					<view class="arrow_right"></view>
					<view class="pk_create_text">数量：{{item.num}}个</view>
					<view class="arrow_left"></view>
				</view>
				<view v-for="n in item.num" class="zj_list">
					<view class="side_left">
						<template v-if="item.side_left[n]">
						<image 
							@click="previewImage(item.side_left[n]['goods_data'].image, item.side_left[n]['goods_data'].title, (item.side_left[n]['goods_data'].price*1).toFixed(1))"
							:src="item.side_left[n]['goods_data'].image"></image>
						<view class="goods_title">
							<view class="g_title">{{item.side_left[n]['goods_data'].title}}</view>
							<view v-if="item.win == 'side_right'" class="g_level">赠品</view>
							<view v-else class="g_level">{{item.side_left[n].odds_title}}</view>
						</view>	
						</template>
						<template v-else>
							无
						</template>
					</view>
					<view class="side_right">
						<template v-if="item.side_right[n]">
						<image 
							@click="previewImage(item.side_right[n]['goods_data'].image, item.side_right[n]['goods_data'].title, (item.side_right[n]['goods_data'].price*1).toFixed(1))"
							:src="item.side_right[n]['goods_data'].image"></image>
						<view class="goods_title">
							<view class="g_title">{{item.side_right[n]['goods_data'].title}}</view>
							<view v-if="item.win == 'side_left'" class="g_level">赠品</view>
							<view v-else class="g_level">{{item.side_right[n].odds_title}}</view>
						</view>	
						</template>
						<template v-else>
							无
						</template>
					</view>
				</view>
			</view>
		</view>
		<view v-if="current_index == 2" class="view_tabs_div view_tabs_three">
			<view class="pk_list" v-for="(item,z) in orderList">
				<image
					src="https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240913/8390a9ff5638f0e03abd7e0e49207aa6.png"  
					class="mask-img" mode="aspectFit"></image>
				<view class="pk_create">
					<view class="arrow_right"></view>
					<view class="pk_create_text">创建时间：{{item.create_time}}</view>
					<view class="arrow_left"></view>
				</view>
				<view class="pk_num">
					<view class="arrow_right"></view>
					<view class="pk_create_text">数量：{{item.num}}个</view>
					<view class="arrow_left"></view>
				</view>
				<view class="pk_operate">
					<view class="pk_operate_left">
						<view v-if="item.member_left.join" class="user_info">
							<image
								:src="item.member_left.user_img"  
								class="u-img" mode="aspectFit"></image>
							{{item.member_left.username}}
						</view>	
						<view v-else class="btn_add" @click="joinOrderPk(item.order_id)">
							<u-icon name="plus-circle" color="#fff" size="36"></u-icon>
							待加入
						</view>
					</view>
					<view class="pk_operate_right">
						<view v-if="item.member_right.join" class="user_info">
							{{item.member_right.username}}
							<image
								:src="item.member_right.user_img"  
								class="u-img" mode="aspectFit"></image>
						</view>
						<view v-else class="btn_add" @click="joinOrderPk(item.order_id)">
							<u-icon style="margin-right:5px;" name="plus-circle" color="#fff" size="36"></u-icon>
							待加入
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="bottom-vh"></view>
		<view class="bottom-view-footer" v-if="isShowDOM">
			<view class="bottom-view">
				<view class="bottom-view-btn" title="红方" style="background: #e91777;" @touchmove.stop.prevent @click="pageSelectChou('side_left')">
					<image style="width: 76rpx; height:46rpx;" src="https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240914/59e2018e1272d9dd0013344b9b61eba2.png"
						mode="aspectFit"></image>
				</view>
				<view class="bottom-view-btn" title="蓝方" style="background: #162063;" @touchmove.stop.prevent @click="pageSelectChou('side_right')">
					<image style="width: 76rpx; height:46rpx;" src="https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240914/38d19021118c726f7a6c63a41c2dff48.png"
						mode="aspectFit"></image>
				</view>
				<view class="bottom-view-btn" title="满单" style="background: #998df6;" @touchmove.stop.prevent @click="pageSelectChou('side_all')">
					<image style="width: 76rpx; height:46rpx;" src="https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240914/ec82a7fd69a0e7aa99f30c67b400ff06.png"
						mode="aspectFit"></image>
				</view>
			</view>
			<view class="bottom-btn">
				<view class="btn_random" title="换箱" @click="get_random_box">
					<image style="width: 76rpx; height:46rpx;" src="https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240913/fcef761bff779dcfaefefa9f9b21df8c.png"
						mode="aspectFit"></image>
				</view>
			</view>
		</view>
		
		<!-- 加入订单弹窗 -->
		<u-popup z-index="999999" v-model="orderShow2" mode="bottom" :closeable="!selectCoupon">
			<view class="orderbox" v-if="!selectCoupon">
				<view class="order-hearder">
					<view class="order-hearder-0">
						<image :src="boxInfo.footer_image" mode="aspectFit"></image>
					</view>
					<view class="order-hearder-1">
						<view class="hearder-1-title">{{boxInfo.title}}</view>
						<view class="hearder-1-price">
							<text class="hearder-1-price-0">{{boxInfo.price}}</text>
						</view>
					</view>
				</view>
				<view class="box_buydata1">
					<template v-for="(it,ind) in buy_data1">
						<view :class="it.id == buy_data1_id ? 'active': ''" class="buy_fangan">
							{{it.number}}位
						</view>
					</template>
				</view>
				<view class="con" v-if="!isShiwan">
					<view class="box1">
						<view v-if="usedCoupon.length != 0" @click="goSelect"
							class="rowitem n-flex-row n-justify-between" style="margin-top: 10rpx;">
							<view class="l">
								<image src="../../../static/image/quanlogo.png" mode=""></image>
								{{ $t("优惠券") }}
							</view>
							<u-icon label-pos="left" :label-color="youhuiNum == '0'?'#999':'#d81e06'" color="#999"
								name="arrow-right" :label="youhuiNum == '0'?'未选择优惠券':'-￥'+youhuiNum">
							</u-icon>
						</view>
		
						<view view class="total" v-if="offer_remarks!=''" style="color: #999; font-size: 26rpx;">
							{{ $t("优惠说明") }}：<text style="font-size: 24rpx;">{{offer_remarks}}</text>
						</view>
					</view>
		
					<view class="box1" style="padding-top: 0;">
						<u-radio-group style="display: block;" width="34rpx" v-model="paymode" active-color="#00fcec">
							<view class="rowitem payrow" @click="selectPay2('integral')">
								<view class="l">
									<image src="../../../static/image/xr.png" mode=""></image>
									{{ $t("糯米值") }} <text
										style="font-size: 24rpx;color: #999;margin-left: 6rpx;">(余额：{{userInfo.integral}})</text>
								</view>
								<u-radio name="integral"></u-radio>
							</view>
							<!-- 微信支付开关 -->
							<view class="rowitem payrow" @click="selectPay2('wechat')">
								<view class="l">
									<image src="../../../static/image/weixinf.png" mode=""></image>
									{{ $t("微信") }}
								</view>
								<u-radio name="wechat"></u-radio>
							</view>
							<!-- #ifdef APP-PLUS || H5 -->
							<view class="rowitem payrow" @click="selectPay2('alipay')">
								<view class="l">
									<image src="../../../static/image/zhifubao.png" mode=""></image>
									{{ $t("支付宝") }}
								</view>
								<u-radio name="alipay"></u-radio>
							</view> 
							<!-- #endif -->
						</u-radio-group>
					</view>
					<view v-if="is_combination" class="pay_model_select" @click="selectPayModel2">
						<image v-if="!is_pay_default" style="width:40rpx; height:40rpx;" src="../../../static/image/pay.png" mode=""></image>
						<image v-else style="width:40rpx; height:40rpx;" src="../../../static/image/pay_on.png" mode=""></image>
						<view class="pm_select_text">优先扣除糯米值</view>
					</view>
				</view>
		
				<view class="obtm">
					<view class="pay_tips" v-if="integral_price > 0">
						共支付：{{sumprice}}，扣除糯米值：{{integral_price}}
					</view>
					<button @click="$debounceClick(join_pay)">{{ $t("立即支付") }}
						{{ paymode === 'integral' ? '糯米值' : '' }}
						<text>￥{{pay_price}}</text></button>
					<view class="fahuo-time">{{ $t("支付完成后需要到背包提货，提交提货后商家会在7天内发货") }}</view>
					<view class="xieyi">
						<u-checkbox v-model="xieyi" shape="circle" active-color="#00fcec" label-size="22"
							class="xieyi-view">
							{{ $t("我已满18岁，已阅读并同意") }}<text
								@click.stop="$.to('/pagesB/pages/my/agreement?type=payment_agreement')">《{{ $t("支付服务协议") }}》</text>
							<text @click.stop="$.to('/pagesB/pages/my/agreement?type=delivery_rule')">《{{ $t("发货服务协议") }}》</text>
							<text @click.stop="$.to('/pagesB/pages/my/agreement?type=play_agreement')">《{{ $t("玩法介绍") }}》</text>
							<!-- <text @click.stop="$.to('/pages/my/agreement?type=exchange_tisp')">《转换须知》</text> -->
		
						</u-checkbox>
					</view>
				</view>
			</view>
		
			<view class="syouhui" v-else>
				<view class="youtit">
					<view class="back" @click="selectCoupon = false">
						<u-icon size="40" name="arrow-left"></u-icon>
					</view>
					<view class="youhuit">
						{{ $t("优惠详情") }}
					</view>
				</view>
				<view class="youhuicon">
					<scroll-view scroll-y class="shitu">
						<radio-group>
							<view class="couList" v-for="(item,idx) in usedCoupon" :key="idx"
								@click="selectCoupon1(item)">
								<view class="l">
									<view class="aa">
										￥<text class="pri">{{item.coupon_data.number}}</text>
										<view class="tiao" v-if="item.coupon_data.type == 0">{{ $t("无门槛") }}</view>
										<view class="tiao" v-if="item.coupon_data.type == 1">
											{{ $t("满") }}{{item.coupon_data.tj_number}}{{ $t("减") }}{{item.coupon_data.number}}
										</view>
									</view>
								</view>
								<view class="r">
									<view class="ll">
										<view class="t">{{item.coupon_data.title}}</view>
										<view class="qi" style="margin-top: 20rpx;">{{ $t("有效期至") }}
											{{$u.timeFormat(item.coupon_data.end_time, 'yyyy-mm-dd hh:MM:ss')}}
										</view>
									</view>
									<view class="rr">
										<radio :value="item.id+''" :checked="currentCoupon.id == item.id" color="#000"
											style="transform:scale(0.8)" />
									</view>
								</view>
							</view>
						</radio-group>
					</scroll-view>
					<view class="btn" @click="confirmCoupon">
						{{ $t("确认") }}
					</view>
				</view>
			</view>
		</u-popup>
		<!-- 加入订单弹窗结束 -->

		<!-- 订单弹窗开始 -->
		<u-popup z-index="999999" v-model="orderShow" mode="bottom" :closeable="!selectCoupon">
			<view class="orderbox" v-if="!selectCoupon">
				<view class="order-hearder">
					<view class="order-hearder-0">
						<image :src="boxInfo.footer_image" mode="aspectFit"></image>
					</view>
					<view class="order-hearder-1">
						<view class="hearder-1-title">{{boxInfo.title}}</view>
						<view class="hearder-1-price">
							<text class="hearder-1-price-0">¥{{boxInfo.price}}/抽</text>
						</view>
					</view>
				</view>
				<view class="box_buydata1">
					<template v-for="(it,ind) in buy_data1">
						<view :class="ind == current_buy_index ? 'active': ''" @click="buydata_tabs(ind)" class="buy_fangan">
							{{it.number}}位
						</view>
					</template>
				</view>
				<view class="con" v-if="!isShiwan">
					<view class="box1">
						<view v-if="usedCoupon.length != 0" @click="goSelect"
							class="rowitem n-flex-row n-justify-between" style="margin-top: 10rpx;">
							<view class="l">
								<image src="../../../static/image/quanlogo.png" mode=""></image>
								{{ $t("优惠券") }}
							</view>
							<u-icon label-pos="left" :label-color="youhuiNum == '0'?'#999':'#d81e06'" color="#999"
								name="arrow-right" :label="youhuiNum == '0'?'未选择优惠券':'-￥'+youhuiNum">
							</u-icon>
						</view>

						<view view class="total" v-if="offer_remarks!=''" style="color: #999; font-size: 26rpx;">
							{{ $t("优惠说明") }}：<text style="font-size: 24rpx;">{{offer_remarks}}</text>
						</view>
					</view>

					<view class="box1" style="padding-top: 0;">
						<u-radio-group style="display: block;" width="34rpx" v-model="paymode" active-color="#00fcec">
							<view class="rowitem payrow" @click="selectPay('integral')">
								<view class="l">
									<image src="../../../static/image/xr.png" mode=""></image>
									{{ $t("糯米值") }} <text
										style="font-size: 24rpx;color: #999;margin-left: 6rpx;">(余额：{{userInfo.integral}})</text>
								</view>
								<u-radio name="integral"></u-radio>
							</view>
							<!-- 微信支付开关 -->
							<view class="rowitem payrow" @click="selectPay('wechat')">
								<view class="l">
									<image src="../../../static/image/weixinf.png" mode=""></image>
									{{ $t("微信") }}
								</view>
								<u-radio name="wechat"></u-radio>
							</view>
							<!-- #ifdef APP-PLUS || H5 -->
							<view class="rowitem payrow" @click="selectPay('alipay')">
								<view class="l">
									<image src="../../../static/image/zhifubao.png" mode=""></image>
									{{ $t("支付宝") }}
								</view>
								<u-radio name="alipay"></u-radio>
							</view> 
							<!-- #endif -->
						</u-radio-group>
					</view>
					<view v-if="is_combination" class="pay_model_select" @click="selectPayModel">
						<image v-if="!is_pay_default" style="width:40rpx; height:40rpx;" src="../../../static/image/pay.png" mode=""></image>
						<image v-else style="width:40rpx; height:40rpx;" src="../../../static/image/pay_on.png" mode=""></image>
						<view class="pm_select_text">优先扣除糯米值</view>
					</view>
				</view>

				<view class="obtm">
					<view class="pay_tips" v-if="integral_price > 0">
						共支付：{{sumprice}}，扣除糯米值：{{integral_price}}
					</view>
					<block v-if="isShiwan"><button @click="shiwan">{{ $t("立即试玩") }}</button></block>
					<block v-else><button @click="$debounceClick(pay)">{{ $t("立即支付") }}
							{{ paymode === 'integral' ? '糯米值' : '' }}
							<text>￥{{pay_price}}</text></button>
					</block>
					<view class="fahuo-time">{{ $t("支付完成后需要到背包提货，提交提货后商家会在7天内发货") }}</view>
					<view class="xieyi">
						<u-checkbox v-model="xieyi" shape="circle" active-color="#00fcec" label-size="22"
							class="xieyi-view">
							{{ $t("我已满18岁，已阅读并同意") }}<text
								@click.stop="$.to('/pagesB/pages/my/agreement?type=payment_agreement')">《{{ $t("支付服务协议") }}》</text>
							<text @click.stop="$.to('/pagesB/pages/my/agreement?type=delivery_rule')">《{{ $t("发货服务协议") }}》</text>
							<text @click.stop="$.to('/pagesB/pages/my/agreement?type=play_agreement')">《{{ $t("玩法介绍") }}》</text>
							<!-- <text @click.stop="$.to('/pages/my/agreement?type=exchange_tisp')">《转换须知》</text> -->
						</u-checkbox>
					</view>
				</view>
			</view>

			<view class="syouhui" v-else>
				<view class="youtit">
					<view class="back" @click="selectCoupon = false">
						<u-icon size="40" name="arrow-left"></u-icon>
					</view>
					<view class="youhuit">
						{{ $t("优惠详情") }}
					</view>
				</view>
				<view class="youhuicon">
					<scroll-view scroll-y class="shitu">
						<radio-group>
							<view class="couList" v-for="(item,idx) in usedCoupon" :key="idx"
								@click="selectCoupon1(item)">
								<view class="l">
									<view class="aa">
										￥<text class="pri">{{item.coupon_data.number}}</text>
										<view class="tiao" v-if="item.coupon_data.type == 0">{{ $t("无门槛") }}</view>
										<view class="tiao" v-if="item.coupon_data.type == 1">
											{{ $t("满") }}{{item.coupon_data.tj_number}}{{ $t("减") }}{{item.coupon_data.number}}
										</view>
									</view>
								</view>
								<view class="r">
									<view class="ll">
										<view class="t">{{item.coupon_data.title}}</view>
										<view class="qi" style="margin-top: 20rpx;">{{ $t("有效期至") }}
											{{$u.timeFormat(item.coupon_data.end_time, 'yyyy-mm-dd hh:MM:ss')}}
										</view>
									</view>
									<view class="rr">
										<radio :value="item.id+''" :checked="currentCoupon.id == item.id" color="#000"
											style="transform:scale(0.8)" />
									</view>
								</view>
							</view>
						</radio-group>
					</scroll-view>
					<view class="btn" @click="confirmCoupon">
						{{ $t("确认") }}
					</view>
				</view>
			</view>
		</u-popup>
		<!-- 订单弹窗结束 -->
		<!-- 优惠券弹窗 -->
		<u-popup v-model="couponshow" mode="center" :custom-style="{backgroundColor: 'rgba(0, 0, 0, 0)'}">
			<view class="newPeopleBox">
				<view class="newmainBox">
					<scroll-view scroll-y class="youhuilist">
						<view class="youhuibox" v-for="(item,idx) in couponList" :key="idx">
							<view class="left">
								<view>
									<view class="name">{{item.title}}</view>
									<view class="price1" v-if="item.type == 1">
										{{ $t("满") }}{{item.tj_number}}{{ $t("可用") }}
									</view>
									<view class="price1" v-if="item.type == 0">
										<text class="pri">￥{{item.number}}</text>{{ $t("无门槛") }}
									</view>

								</view>
							</view>
							<view class="right">
								<view>
									<view class="price">￥<text>{{item.number}}</text></view>
									<view class="ling" :class="item.is_lingqu == 0?'active':'yiling'"
										@click="receive(item.id,item.is_lingqu,idx)">
										{{item.is_lingqu == 0?'领取':'已领取'}}
									</view>

								</view>
							</view>
						</view>
					</scroll-view>
				</view>
				<view class="btm-2">
					<!-- <image class="btmBg" src="http://mhimg.69box.cn/kaixiang/rv.webp" mode="widthFix"></image> -->
					<view class="btn1">
						<image @click="receiveall()" src="http://mhimg.69box.cn/kaixiang/sd.png" mode="widthFix">
						</image>
					</view>
				</view>

				<view class="off">
					<image @click="couponshow = !couponshow" src="http://mhimg.69box.cn/kaixiang/down.png" mode="">
					</image>
				</view>
			</view>

		</u-popup>

		<u-popup v-model="tiploginShow"  mode="center" z-index="99999999999" :custom-style="{backgroundColor: 'rgba(0, 0, 0, 0)'}">
			<view class="tiploginShow-view">
				<view class="tiploginShow-view-0">您还未登录</view>
				<view class="tiploginShow-view-1">请登录以后再进行此操作~</view>
				<view class="tiploginShow-view-2" @click="gotologin">前往登录</view>
				<view class="tiploginShow-view-3" @click="tiploginShow = false">暂不登录</view>
			</view>
		</u-popup>

		<!-- 开奖 -->
		<MhOpenPk ref="mpopen" v-if="open_result" @closeOpenView="closeOpenView" :order_result="order_result" ></MhOpenPk>
		<Previmg
			@closePrevimg="closePrevimg"
			:is_preview="is_preview" 
			:title="preview.title" 
			:imgurl="preview.imgurl" 
			:price="preview.price" ></Previmg>
	</view>
</template>

<script>
let x = 0;
// import debounceClick from '@/utils/function.js'
import MhOpenPk from '@/components/mhopenpk.vue'
import Previmg from '@/components/previmg.vue'
export default {
	components: {
		MhOpenPk,
		Previmg
	},
	data() {
		return {
				tabs_list:[ { name: '预览'}, {name: '中奖记录'}, {name: 'PK对战'} ],
				is_combination:0,
				is_pay_default:-1,
				integral_price:0,
				sumprice:0,
				pay_side:'',
				current_index:0,
				buy_data1_id:0,
				buy_data1_id_old:0,
				tempInterval: undefined,
				tiploginShow:false,
				shouLuck: false,
				isLoading: true,
				usedCoupon: [],
				currentCoupon: '', //当选择的优惠券
				Confirmed: '', //已确认的优惠券
				youhuiNum: '0',
				swiperCurrent: 0,
				goodsshow: false, //所有商品列表
				id: '', //盲盒id
				blind_box_odds: [], //盲盒商品概率
				boxList: [], //盲盒商品列表
				allBoxList: [],
				gunList: [], //底部滚动商品数据
				muteBgMusic: true,
				name: '', //盲盒名字
				totalGoods: [], //没循环的商品
				goodsPrice: '0.00', //商品价格
				boxPrice: '0.00', //盲盒价格
				boxInfo: '', //盲盒详情
				buy_data1:[], 
				current_buy_index:0, // 方案下标
				old_buy_index:0,
				box_info_page: 0, //盲和位置
				box_info_pagesize: 0, //盲和总数字
				goods_stock: 0, //剩余
				goods_stock_total: 0, //总数
				next_box_info_id: 0,
				prev_box_info_id: 0,	
				orderShow: false, //订单弹窗
				orderShow2: false, //订单弹窗
				luckshow: false, //抽奖弹窗
				isShiwan: true, //是否试玩
				num: '', //几抽
				xieyi: true,
				// #ifdef MP-WEIXIN || H5
				paymode: 'integral',
				// #endif

				// #ifdef APP-PLUS
				paymode: 'integral',
				// #endif
				selectCoupon: false, //选择优惠券
				kfshow: false,
				max: '',
				min: '',
				bi: '',
				total: '',
				xyTotal: '',
				fGoods: {
					cs: [],
					ss: [],
					xy: [],
					gj: []
				},
				pay_price: 0, //支付价格
				buy_fangan: [], //购买方案
				currentCoupon_id: 0, //优惠券ID
				dian: 'dian1',
				xing: '', //芝麻粒
				diKou: 0, //抵扣芝麻粒数量
				statusBarHeight: 0,
				log_page: 1,
				log_pagesize:15,
				log_total_page:1,
				log_record_total:0,
				tongList: [], //中奖通知
				orderList: [], //中奖通知
				tong: '',
				dings: '',
				integralPrice: 0,
				xyb: 0, //糯米值
				offer_remarks: '',
				userInfo: null,
				noClick: true,
				deliveryRuleText: '',
				deliveryRuleTextTitle: '',
				couponshow: false, //优惠券弹窗
				daojushow: false, //道具卡弹窗
				couponList: [], //优惠券列表
				cardList: [], //道具卡
				cardShow: false,
				isCard: true, //我的道具卡与使用规则切换
				isLogin: false,
				page: 1,
				status: 'more', //  加载状态  more:有更多数据  noMore:已加载全部数据  loading:数据加载中
				bannerIdx: 0,
				isShowDOM: false,
				selectTag: 0,
				zhongjiangList: [],
				textColor: ['#e63541', '#6c54f7', '#e6c560', '#1ea1fe', '#43f3f6', '#e6c560', '#e63541', '#6c54f7'],
				//加入订单
				is_join_buy:0,
				join_order_id:0,
				join_order_no:'',
				join_pay_side:'',
				open_result:false,
				order_result:{},
				orderShow:false,
				is_preview:0,
				preview:{
					imgurl : '',
					title: '',
					price: ''
				},
			}
		},
		onLoad(option) {
			this.id = option.id
			this.get_blind_box_odds();
			this.getBox();
			uni.loadFontFace({
				family: 'myfont',
				source: 'url("https://img.50api.cn/dingdang/YouSheBiaoTiHei.ttf")',
			})
			uni.$on('chongchou', (data) => {
				this.page = 1
				this.get_blind_box_odds();
				this.getBox();
			})
			let _that = this;
			uni.getStorage({
				key: 'bgMusic',
				success: function (res) {
					_that.muteBgMusic = res.data;
					console.log(_that.muteBgMusic);
					if(_that.muteBgMusic){
						_that.$music.play();
					}
				},
				fail: function (res) {
					if(_that.muteBgMusic){
						_that.$music.play();
					}
				}
			});
		},
		onShow() {
			this.getLuckPeople()
			this.page = 1
			this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'] === 20 ? 200 : uni.getSystemInfoSync()[
				'statusBarHeight'] + 88 + 44 + 134
			// this.getUser()
			this.getDeliveryRuleText()

			if (uni.getStorageSync('user')) {
				this.isLogin = true
			} else {
				this.isLogin = false
			}
			let that = this;
			wx.onAppShow((res) => {
				if(res.scene == '1038'){
					if(that.query_now){
						return;
					}
					that.orderShow = false;
					that.query_order();
				}
			});
		},
		onReachBottom(e) {

		},
		onUnload() {
			uni.$off('chongchou')
		},
		destroyed() {
			this.$music.destroy();
		},
		methods: {
			previewImage(imgurl, title, price){
				console.log("1234");
				this.preview = {
						imgurl : imgurl,
						title: title,
						price: price
					}
				this.is_preview = 1;
			},
			closePrevimg(){
				this.is_preview = 0;
				console.log("8899");
			},
			selectPayModel(){
				this.is_pay_default = this.is_pay_default ? 0 : 1;
				this.is_more = 1;
				this.get_box_price();
			},
			selectPayModel2(){
				this.is_pay_default = this.is_pay_default ? 0 : 1;
				this.is_more = 1;
				this.get_box_price2();
			},
			closeOpenView(){
				this.open_result = false;
			},
			get_boxinfo(type){
				let box_id = type == 'prev' ? this.prev_box_info_id : this.next_box_info_id;
				if(!box_id){
					this.$tip.tip("暂无数据");
					return
				}
				this.id = box_id;
				this.page = 1;
				this.get_blind_box_odds();
				this.getBox();
				this.getTong();
				this.getOrder();
				
			},
			get_openlogs(type){
				if(this.log_total_page == 1){
					this.$tip.tip("暂无其他分页");
					return
				}
				if(type == 'prev'){
					this.log_page--;
				}else{
					this.log_page++;
				}
				if(this.log_page < 1){
					this.log_page = this.log_total_page;
				}
				if(this.log_page > this.log_total_page){
					this.log_page = 1;
				}
				this.getTong();
			},
			changTabs(e){
				this.current_index = e;
				if(this.current_index == 1){
					this.getTong();
				}else if(this.current_index == 2){
					this.getOrder();
				}
			},
			gotologin(){
				uni.navigateTo({
					url:'/pagesB/pages/my/login'
				})
			},
			changeswiper(params) {
				console.log(params)
				this.bannerIdx = params.detail.current
			},
			changeBanner(params) {
				if (params === 'left') {
					if (this.bannerIdx === 0) {
						this.bannerIdx = this.boxList.length - 1
					} else {
						this.bannerIdx -= 1
					}
				} else {
					if (this.bannerIdx === this.boxList.length - 1) {
						this.bannerIdx = 0
					} else {
						this.bannerIdx += 1
					}
				}
			},
			buydata_tabs(index){
				this.old_buy_index = this.current_buy_index;
				this.current_buy_index = index;
				if(!this.isLogin){
					this.tiploginShow = true
					return false
				}
				this.is_more = 0;
				this.buy_data1_id_old = this.buy_data1_id;
				this.buy_data1_id = this.buy_data1[index].id;
				this.query_stock();
			},
			query_stock(){
				this.$http({
					url: "api/BlindBox/query_stock",
					data: {
						blind_box_id: this.id,
						buy_data1_id: this.buy_data1_id,
					}
				}).then(res => {
					if (res.data.code == 1) {
						this.choujiang(true)
						return;
					}
					this.buy_data1_id = this.buy_data1_id_old;
					this.current_buy_index = this.old_buy_index;
					this.$tip.tip("库存不足");
				}).catch(err => {});
			},
			joinOrderPk(pk_order_id){
				this.is_join_buy = 1;
				this.query_order_for_id(pk_order_id);
			},
			pageSelectChou(pay_side) {
				if(!this.isLogin){
					this.tiploginShow = true
					return false
				}
				this.is_more = 0;
				this.pay_side = pay_side;
				this.is_join_buy = 0;
				this.buy_data1_id_old = this.buy_data1_id = this.buy_data1[this.current_buy_index].id;
				this.query_stock()
			},
			// 免费试玩
			tryPlay() {
				uni.navigateTo({
					url: `/pagesB/pages/home/luckbox?id=${this.id}&drawNum=5&type=play`
				})
			},
			cancelLogin() {
				// uni.navigateBack()
				this.isLogin = false;
			},
			// 获取我的道具卡
			getCard() {
				this.$http({
					url: "api/member/get_my_card"
				}).then(res => {
					if (res.data.code == 1) {
						if (res.data.data.length == 0) {
							this.cardShow = true
						} else {
							this.cardShow = false
						}
						this.cardList = res.data.data
					} else {
						this.cardShow = true
					}
				}).catch(err => {});
			},
			// 领取全部优惠券
			receiveall() {
				let arr = []
				this.couponList.forEach(item => {
					if (item.is_lingqu == 0) {
						arr.push(item.id)
					}
				})
				if (arr.length == 0) {
					this.$tip.tip("暂无可领取优惠券");
					return
				}
				if(!this.isLogin){
					this.tiploginShow = true
					return false
				}
				var arrJoinString = arr.join();
				this.$http({
					url: "api/member/receive_coupon",
					data: {
						cid: arrJoinString
					}
				}).then(res => {
					if (res.data.code == 1) {
						this.couponList.forEach(item => {
							item.is_lingqu = 1
						})
						this.getNotUsed()
						this.$tip.tip(res.data.msg)
					} else {
						this.$tip.tip(res.data.msg)
					}
				}).catch(err => {});

			},
			// 领取单个优惠券
			receive(id, is_lingqu, idx) {
				if (is_lingqu == 1) {
					this.$tip.tip("该优惠券已经领取过了");
					return;
				}
				this.$http({
					url: "api/member/receive_coupon",
					data: {
						cid: id
					}
				}).then(res => {
					if (res.data.code == 1) {
						this.couponList[idx].is_lingqu = 1
						this.getNotUsed()
						this.$tip.tip("优惠券领取成功");
					} else {
						this.$tip.tip(res.data.msg)
					}
				}).catch(err => {});


			},
			lingquan() {
				this.getYouhui()
			},
			getYouhui() {
				this.$http({
					url: "api/common/get_coupon",
					data: {
						uid: uni.getStorageSync("user").id
					},
				}).then(res => {
					console.log(res, '优惠券');
					if (res.data.code == 1) {
						this.couponList = res.data.data
					}
				}).catch(err => {});
			},
			getUser() {
				this.$http({
					url: "api/member/get_user_info",
				}).then(res => {
					if (res.data.code == 1) {
						this.xyb = res.data.data.integral
					}
				}).catch(err => {});
			},
			//获取盲盒概率
			get_blind_box_odds() {
				this.$http({
					url: "api/common/get_blind_box_odds",
					data: {
						blind_box_id: this.id
					},
				}).then(res => {
					if (res.data.code == 1) {
						console.log(res.data.data, 'res.data.data')
						this.blind_box_odds = res.data.data;
					}
				}).catch(err => {});
			},
			getTong() {
				this.$http({
					url: "api/common/get_blind_box_pk_log",
					data: {
						blind_box_id: this.id,
						page: this.log_page,
						pagesize:this.log_pagesize,
					}
				}).then(res => {
					if (res.data.code == 1) {
						this.tongList = res.data.data.order_list;
						this.log_total_page  = res.data.data.total_page;
						this.log_record_total = res.data.data.record_total;
					}
				}).catch(err => {});
			},
			getOrder() {
				this.$http({
					url: "api/common/get_blind_box_pk_order",
					data: {
						blind_box_id: this.id
					}
				}).then(res => {
					if (res.data.code == 1) {
						this.orderList = res.data.data
					}
				}).catch(err => {});
			},
			tongz() {
				if (this.tongList.length == 0) {
					return
				}
				var arr = this.$u.randomArray(this.tongList)
				arr.forEach(item => {
					item.text = '恭喜 ' + item.username + ' 获得' + item.goods_name
					item.text = [item.text]
					item.bg = 'https://img.50api.cn/dingdang/sstz.png'
					// if (item.tag == 'legend') {
					// 	item.bg = 'https://img.50api.cn/dingdang/cstz.png'
					// } else {
					// 	item.bg = 'https://img.50api.cn/dingdang/sstz.png'
					// }
				})
				this.tong = arr[0]
				this.dings = setTimeout(() => {
					this.tong = ""
				}, 9000)
			},
			// 获取芝麻粒
			getXing() {
				this.$http({
					url: "api/member/get_user_info",
				}).then(res => {
					if (res.data.code == 1) {
						this.userInfo = res.data.data;
						uni.setStorageSync('user', res.data.data)
						uni.$emit('updataUser');
						this.xing = res.data.data.integral2
						if (this.xing == 0) {
							this.get_box_price();
							return
						}
						var max = (this.boxPrice * this.num * 0.1).toFixed(3)
						if ((this.xing / this.boxInfo.integral2_dikou_rmb) > max) {
							this.diKou = max
						} else {
							this.diKou = (this.xing / this.boxInfo.integral2_dikou_rmb).toFixed(3)
						}
						console.log(max);
						console.log()

						this.get_box_price();
					}
				}).catch(err => {});
			},
			// 加入订单 - 获取芝麻粒
			getXing2() {
				this.$http({
					url: "api/member/get_user_info",
				}).then(res => {
					if (res.data.code == 1) {
						this.userInfo = res.data.data;
						uni.setStorageSync('user', res.data.data)
						uni.$emit('updataUser');
						this.xing = res.data.data.integral2
						if (this.xing == 0) {
							this.get_box_price2();
							return
						}
						var max = (this.boxPrice * this.num * 0.1).toFixed(3)
						if ((this.xing / this.boxInfo.integral2_dikou_rmb) > max) {
							this.diKou = max
						} else {
							this.diKou = (this.xing / this.boxInfo.integral2_dikou_rmb).toFixed(3)
						}
						this.get_box_price2();
					}
				}).catch(err => {});
			},
			// 定位锚点
			ding(val) {
				this.dian = 'dian' + val.id
			},
			open_show_logs(){
				this.$http({
					url: "api/order/get_order_record",
					data: {
						blind_box_id: this.id
					}
				}).then(res => {
					console.log(res, "商品");
					if (res.data.code == 1) {
						this.fGoods = res.data.data
					}
				}).catch(err => {});
			},
			// 获取商品列表
			getFgoods() {
				this.$http({
					url: "api/common/get_blind_box_odds_goods",
					data: {
						blind_box_id: this.id
					}
				}).then(res => {
					console.log(res, "商品");
					if (res.data.code == 1) {
						this.fGoods = res.data.data
					}
				}).catch(err => {});
			},
			// 选择优惠券
			selectCoupon1(val) {
				if (this.currentCoupon == val) {
					this.currentCoupon = '';
					this.Confirmed = '';
					this.youhuiNum = 0;
					this.currentCoupon_id = 0;
					this.get_box_price();
					return;
				}
				this.currentCoupon = val
			},
			// 确认选择优惠券
			confirmCoupon() {
				if (!this.currentCoupon) {
					this.Confirmed = '';
					this.youhuiNum = 0;
					this.currentCoupon_id = 0;
					this.selectCoupon = false;
					this.get_box_price();
					return;
				}
				if (this.currentCoupon.type != 0) {
					if ((this.boxPrice * this.num) < this.currentCoupon.coupon_data.tj_number) {
						this.$tip.tip("该优惠券不可用")
						return
					}
				}
				this.Confirmed = this.currentCoupon
				this.youhuiNum = this.Confirmed.coupon_data.number
				this.currentCoupon_id = this.currentCoupon.id;
				this.selectCoupon = false
				this.get_box_price();

			},
			//获取加入订单 支付价格
			get_box_price2() {
				// console.log(this.boxData[this.swiperCurrent].id ,'this.boxData[this.swiperCurrent].id')
				this.$http({
					url: "api/pay/get_box_price_pk",
					data: {
						boxid: this.id,
						buy_data1_id: this.buy_data1_id,
						currentCoupon_id: this.currentCoupon.id,
						pay_side: this.join_pay_side,
						is_join_buy: this.is_join_buy,
						is_pay_default: this.is_pay_default,
						paymode: this.paymode,
						is_more: this.is_more,
						client: 1
					}
				}).then(res => {
					if (res.data.code == 1) {
						this.pay_price = res.data.data.price;
						this.paymode = res.data.data.paymode;
						// this.offer_remarks = res.data.data.offer_remarks;
						this.offer_remarks = res.data.data.offer_remarks;
						this.is_combination = res.data.data.is_combination;
						this.is_pay_default = res.data.data.is_pay_default;
						this.integral_price = res.data.data.integral_price;
						this.sumprice = res.data.data.sumprice;
					} else {
						this.$tip.tip('获取价格失败，请关闭重试')
					}
				}).catch(err => {});
			},
			//获取支付价格
			get_box_price() {
				// console.log(this.boxData[this.swiperCurrent].id ,'this.boxData[this.swiperCurrent].id')
				this.buy_data1_id = this.buy_data1[this.current_buy_index].id;
				this.$http({
					url: "api/pay/get_box_price_pk",
					data: {
						boxid: this.id,
						buy_data1_id: this.buy_data1_id,
						currentCoupon_id: this.currentCoupon.id,
						pay_side: this.pay_side,
						is_pay_default: this.is_pay_default,
						paymode: this.paymode,
						is_more: this.is_more,
						client: 1
					}
				}).then(res => {
					if (res.data.code == 1) {
						this.pay_price = res.data.data.price;
						this.paymode = res.data.data.paymode;
						this.offer_remarks = res.data.data.offer_remarks;
						
						this.is_combination = res.data.data.is_combination;
						this.is_pay_default = res.data.data.is_pay_default;
						this.integral_price = res.data.data.integral_price;
						this.sumprice = res.data.data.sumprice;
					} else {
						this.$tip.tip(res.data.msg)
					}
				}).catch(err => {});
			},
			goSelect() {
				this.selectCoupon = true
				this.getNotUsed()
			},
			// 获取未使用优惠券
			getNotUsed() {
				this.$http({
					url: "api/member/get_my_coupon",
				}).then(res => {
					if (res.data.code == 1) {
						this.usedCoupon = res.data.data
					}
				}).catch(err => {});
			},
			hide() {
				this.kfshow = false
			},
			// 联系客服
			lxkefu() {
				this.$refs.child.getKf()
				this.kfshow = true
			},
			// 支付
			pay() {
				let that = this;
				if (!that.xieyi) {
					that.$tip.tip("请阅读并同意协议")
					return
				}
				if (that.paymode == "") {
					that.$tip.tip("请选择支付方式")
					return
				}
				if (that.pay_side == "") {
					that.$tip.tip("请选择队伍")
					return
				}
				let price = that.pay_price;
				uni.showLoading({
					title: '正在请求支付...',
					mask: true
				});
				that.$http({
					url: "api/pay/go_adapay_pk",
					data: {
						boxid: that.id,
						buy_data_id: that.buy_data1_id,
						paymode: that.paymode,
						currentCoupon_id: that.currentCoupon.id,
						price: price,
						pay_side:that.pay_side,
						xs: (that.diKou * that.boxInfo.integral2_dikou_rmb).toFixed(0),
						client: 1,
						is_pay_default: that.is_pay_default,
					}
				}).then(res => {
					uni.hideLoading();
					console.log(res);
					if (res.data.code == 1) {
						that.order_no = res.data.data.order_no;
						wx.navigateToMiniProgram({
							appId: res.data.data.expend.wx_app_id, // 汇付收银台小程序的 appId
							path: res.data.data.expend.miniapp_path,
							success(res) {
								that.orderShow = false;
							},
						});
					} else if (res.data.code == 8) { //0元免支付的
						console.log(res);
						that.order_no = res.data.data.ooid;
						if (that.paymode === 'integral') {
							that.$tip.tip("支付成功", "success")
							// 支付成功后操作
							that.query_order();
						}
						that.orderShow = false
					} else {
						that.$tip.tip(res.data.msg)
					}
				}).catch(err => {});
			},
			join_pay() {
				let that = this;
				if (!that.xieyi) {
					that.$tip.tip("请阅读并同意协议")
					return
				}
				if (that.paymode == "") {
					that.$tip.tip("请选择支付方式")
					return
				}
				if (that.join_order_id == "") {
					that.$tip.tip("请选择加入pk的订单")
					return
				}
				let price = that.pay_price;
				uni.showLoading({
					title: '正在请求支付...',
					mask: true
				});
				that.$http({
					url: "api/pay/go_adapay_pkjoin",
					data: {
						order_id:that.join_order_id,
						paymode: that.paymode,
						currentCoupon_id: that.currentCoupon.id,
						price: price,
						xs: (that.diKou * that.boxInfo.integral2_dikou_rmb).toFixed(0),
						client: 1,		
						is_pay_default: that.is_pay_default,
					}
				}).then(res => {
					uni.hideLoading();
					if (res.data.code == 1) {
						that.order_no = res.data.data.order_no;
						wx.navigateToMiniProgram({
							appId: res.data.data.expend.wx_app_id, // 汇付收银台小程序的 appId
							path: res.data.data.expend.miniapp_path,
							success(res) {
								that.orderShow = false;
							},
						});
					} else if (res.data.code == 8) { //0元免支付的
						console.log(res);
						that.order_no = res.data.data.ooid;
						if (that.paymode === 'integral') {
							that.$tip.tip("支付成功", "success")
							that.query_order();
						}
						that.orderShow = false
					} else {
						that.$tip.tip(res.data.msg)
					}
				}).catch(err => {});
			},
			query_order(){
				this.query_now = true;
				this.$http({
					url: "api/order/get_order_pk_details",
					data: {
						blind_box_id: this.id,
						order_no: this.order_no,
						pay_side: this.is_join_buy == 1 ? this.join_pay_side : this.pay_side
					}
				}).then(async res => {	
					this.query_now  = false;
					if (res.data.code == 1) {
						if(res.data.data.status == 0 && res.data.data.pay_side != 'side_all'){
							this.$tip.tip("支付成功，请等待对手加入", "success")
						}else if(res.data.data.status == 1){
							this.order_id = res.data.data.id;
							await this.openBox();
						}else if(res.data.data.status == 2){
							this.$tip.tip("订单已PK完成", "success")
						}else{
							this.$tip.tip("订单已关闭", "success")
						}
						this.id = box_id;
						this.get_blind_box_odds();
						this.getBox();
					}
				}).catch(err => {});
			},
			query_order_for_id(order_id){
				this.$http({
					url: "api/order/query_order_for_id",
					data: {
						order_id: order_id
					}
				}).then(async res => {	
					console.log(res);
					if (res.data.code == 1) {
						if(res.data.data.boxid != this.id){
							this.$tip.tip("订单不存在", "success")
							return;
						}
						if(res.data.data.status == 0 && res.data.data.pay_side != 'side_all'){
							this.buy_data1_id = res.data.data.buy_data_id;
							this.join_order_id = order_id;
							this.join_order_no = res.data.data.order_no;
							this.join_pay_side = res.data.data.pay_side_join;
							this.choujiang2();
						}else if(res.data.data.status == 2){
							this.$tip.tip("PK已被别人加入", "success")
						}else if(res.data.data.status == 3){
							this.$tip.tip("订单已PK完成", "success")
						}else{
							this.$tip.tip("订单已关闭", "success")
						}
					}
				}).catch(err => {});
			},
			openBox() {
				let _that = this;
				uni.showLoading({
					title: '开盒中'
				});
				return new Promise((resolve, reject) => {
					_that.$http({
						url: "api/blind_box/open_pk",
						data: {
							order_id: _that.order_id
						}
					}).then(res => {
						console.log(res, "抽中的商品");
						uni.hideLoading();
						if (res.data.code == 1) {
							if (res.data.code == 1) {
								_that.order_result = res.data.data;
								_that.orderShow = false;
								_that.orderShow2 = false;
								_that.open_result = true;
								_that.$tip.tip(res.data.msg)
								_that.getTong();
								_that.getOrder();
								_that.getBox();
							} else {
								_that.$tip.tip(res.data.msg)
							}
							resolve()
			
						} else {
							_that.$tip.tip(res.data.msg)
						}
					}).catch(err => {
						reject()
					});
				})
			},
			// 获取随机盲盒
			get_random_box() {
				this.$http({
					url: "api/common/get_blind_box_random",
					data: {
						blind_box_id: this.id,
						playtype: 3
					}
				}).then(res => {
					if (res.data.code == 1) {
						if(!res.data.data.blind_box_id){
							this.$tip.tip("暂无其他数据");
							return
						}
						this.id = res.data.data.blind_box_id;
						this.get_blind_box_odds();
						this.getBox();
					}
				}).catch(err => {});
			},
			// 获取未使用优惠券
			getNotUsed() {
				this.$http({
					url: "api/member/get_my_coupon",
				}).then(res => {
					console.log(res, '');
					if (res.data.code == 1) {
						this.usedCoupon = res.data.data
					} else {
						this.show = true
					}
				}).catch(err => {});
			},
			getDeliveryRuleText() {
				this.$http({
					url: "api/common/get_agreement",
					data: {
						name: 'delivery_rule'
					}
				}).then(res => {
					console.log(res);
					if (res.data.code == 1) {
						this.deliveryRuleText = res.data.data.content
						this.deliveryRuleTextTitle = res.data.data.title
					} else {
						this.$tip.tip(res.data.msg)
					}
				}).catch(err => {});
			},
			choujiang(zc) {
				// zc true正常抽 ， false试玩
				this.youhuiNum = 0;
				this.currentCoupon = '';
				this.getNotUsed()
				let normalChou = this.boxInfo.buy_data1[0]
				this.swiperCurrent = 0
				this.buy_fangan = normalChou;
				this.num = normalChou.number
				if (zc) {
					this.isShiwan = false
					this.getXing()
				} else {
					this.isShiwan = true
				}
				this.orderShow = true
			},
			// 加入订单
			choujiang2() {
				// zc true正常抽 ， false试玩
				this.youhuiNum = 0;
				this.currentCoupon = '';
				this.getNotUsed()
				this.isShiwan = false
				this.getXing2()
				this.orderShow2 = true
			},
			//前往查看道具卡规则
			go_prop_card_rule() {
				uni.navigateTo({
					url: '/pagesB/pages/my/agreement?type=prop_card_rule'
				})
			},
			formatRichText(html) {
				let newContent = html.replace(/<img[^>]*>/gi, function(match, capture) {
					match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
					match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
					match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');
					return match;
				});
				newContent = newContent.replace(/style="[^"]+"/gi, function(match, capture) {
					match = match.replace(/width:[^;]+;/gi, 'width:100%;').replace(/width:[^;]+;/gi,
						'width:100%;');
					return match;
				});
				newContent = newContent.replace(/<br[^>]*\/>/gi, '');
				newContent = newContent.replace(/\<img/gi,
					'<img style="width:100%;height:auto;display:block;"');
				return newContent;
			},
			lower(e) {
				console.log(this.status, '222222222222')
				if (this.status != 'noMore') {
					this.getBox()
				}
			},
			//盲盒商品
			getBox() {
				uni.showLoading({
					title: '加载中'
				})
				console.log(this.id);
				this.$http({
					url: "api/common/get_blind_box_goods",
					data: {
						blind_box_id: this.id,
						page: this.page
					}
				}).then(res => {
					console.log(res, "商品");
					uni.hideLoading()
					if (res.data.code == 1) {
						// this.boxList = res.data.data.goods_list
						let total = res.data.data.total; // 数据的长度
						if (this.page == 1) this.boxList = [];
						console.log(res.data.data, ' res.data.data. res.data.data.')
						let curPageData = res.data.data.goods_list
						this.boxList = this.boxList.concat(curPageData);
						if (this.boxList.length < total) {
							this.status = 'more';
							this.page++;
						} else {
							this.status = 'noMore';
						}
						// this.boxList.unshift({
						// 	goods_price: res.data.data.blind_box_info.price,
						// 	goods_image: res.data.data.blind_box_info.image
						// })
						this.boxList.sort((a, b) => {
							return b.goods_price - a.goods_price
						})
						this.boxList.sort((a, b) => {
							return b.odds_sort_text - a.odds_sort_text
						})
						this.goodsPrice = this.boxList[this.swiperCurrent].goods_price
						this.boxPrice = res.data.data.blind_box_info.price
						this.boxInfo = res.data.data.blind_box_info
						this.buy_data1  = res.data.data.blind_box_info.buy_data1;
						
						this.box_info_page = res.data.data.box_info_page
						this.box_info_pagesize = res.data.data.box_info_pagesize
						this.goods_stock = res.data.data.goods_stock
						this.goods_stock_total = res.data.data.goods_stock_total
						
						this.next_box_info_id = res.data.data.next_box_info_id
						this.prev_box_info_id = res.data.data.prev_box_info_id
						
						this.max = res.data.data.goods_price_max
						this.min = res.data.data.goods_price_min
						this.total = res.data.data.total
						this.allBoxList = res.data.data.goods_list
						this.integralPrice = res.data.data.blind_box_info.integral_price
						// this.xyTotal = res.data.data.xynum
						// 数据不够5自动添加
						var data = res.data.data.goods_list
						this.totalGoods = data
						this.gunList = res.data.data.goods_list.concat()
						this.gunList.shift()
						console.log(this.gunList, '滚动数据');
						this.isLoading = false
						this.isShowDOM = true
						if (this.gunList.length < 8) {
							for (var i = 0; i < 8; i++) {
								if (this.gunList.length >= 8) {
									return
								}
								this.gunList = this.gunList.concat(data)
								console.log(this.gunList);
							}
						}
						
					}
				}).catch(err => {});
			},
			back() {
				uni.reLaunch({
				   url:'/pages/tabBar/home'
				});
			},
			playMusic() {
				let _that = this;
				_that.muteBgMusic = !_that.muteBgMusic;
				console.log(_that.muteBgMusic);
				uni.setStorage({
					key: 'bgMusic',
					data: _that.muteBgMusic,
					success: function () {
						if(_that.muteBgMusic){
							_that.$music.play();
						}else{
							_that.$music.pause();
						}
					}
				});
			},
			// 选择支付方式
			selectPay(mode) {
				this.paymode = mode
				this.is_more = 1;
				this.get_box_price()
			},
			// 加入订单 选择支付方式
			selectPay2(mode) {
				this.paymode = mode
				this.is_more = 1;
				this.get_box_price2()
			},
			selectChou(fangan, idx) {
				this.buy_fangan = fangan;
				this.num = fangan.number
				this.swiperCurrent = idx
				this.getXing()
			},

			shiwan() {
				uni.navigateTo({
					url: '/pagesB/pages/home/luckbox'
				})
				this.muteBgMusic = false;
				setTimeout(() => {
					uni.$emit('cdata', {
						id: this.id,
						num: this.buy_fangan.number,
						btnTitle: this.buy_fangan.title
					})
				}, 300)
			},
			// 获取概率商品
			gteRateList(params) {
				const { id } = params
				let boxList = []
				boxList = this.allBoxList.filter(item => {
					if (item.odds_id === id || !item.odds_id) {
						return item
					}
				})
				boxList = boxList.sort((a, b) => JSON.parse(b.goods_price) - JSON.parse(a.goods_price))
				let newArr = this.chunkArray(boxList, 4)
				return newArr
			},
			// 商品拆分
			chunkArray(array, size) {
				const chunkedArray = [];
				let index = 0;

				while (index < array.length) {
					const chunk = array.slice(index, index + size);
					if (chunk.length < size && array.length > size) {
						const remaining = size - chunk.length;
						for (let i = 0; i < remaining; i++) {
							chunk.push(array[i % array.length]);
						}
					}
					chunkedArray.push(chunk);
					index += size;
				}

				return chunkedArray;
			},
			// 查看规格下的中奖
			changeTypeTag(idx, obj) {
				this.selectTag = idx
				if (obj) {
					this.getLuckPeople(obj.id)
				} else {
					this.getLuckPeople()
				}
			},
			// 获取中奖名单
			getLuckPeople(id) {
				let odds_id = this.selectTag === 0 ? '' : id
				this.$http({
					url: "api/common/get_blind_box_open_logs",
					data: {
						odds_id: odds_id
					}
				}).then(res => {
					if (res.data.code === 1) {
						this.zhongjiangList = res.data.data
					}
				})
			}
		}
	}
</script>
<style>
	page {
		background: #b2ddff url("https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240908/4d9b0e2052ce8a54a4c0649cc09d26cf.png") no-repeat top center;
		background-size: 100% auto;
	}
</style>
<style lang="scss" scoped>
	.top-view {
		display: flex;
		box-sizing: border-box;
		background: transparent;
		width: 100%;
		position: fixed;
		z-index: 100;
		background: #edc9ff;
		.sub-view {
			width: 100%;
			align-items: center;
			display: flex;
			justify-content: space-between;
			padding: 0rpx 32rpx 0rpx 32rpx;
			height: 88rpx;
			box-sizing: border-box;
		}

		.sub-view-left,
		.sub-view-right {
			width: 100rpx;

			.back-img {
				width: 50rpx;
				height: 50rpx;
			}
		}

		.sub-view-right {
			display: flex;
			justify-content: flex-end;
		}

		.sub-view-center {
			color: #222;

			image {
				width: 180rpx;
				height: 44rpx;
			}
		}
	}
	.view_tabs{ margin:0 30rpx; }
	.view_tabs_div{ margin:20rpx 30rpx;
		&.view_tabs_three,&.view_tabs_four{
			display: block;
		}
		display: flex;
		flex-wrap: wrap;
		.goods_level{ width:31%; margin-bottom: 30rpx; margin-right: 3%;
			&:nth-child(3n){
				margin-right: 0;
			}
		}
		.c-item-banner-box{
			position: relative;
			display: block;
			background: #fff;
			border-radius: 10px;
			overflow: hidden;
			.back-img{ 
				position: relative;
				height:220rpx; width: 100%; display: block; background: #fff;
				image{ width: 100%; height: 100%; }
				
			}  
			.goods_text{ background:#f9f9f9; padding:5rpx 10rpx 10rpx; 
				.g_title{   
					font-size:12px;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 1;
					overflow: hidden;
					height:20px;
					line-height: 20px;
					overflow: hidden;
					text-overflow: ellipsis; 
				}
				.g_price{
					color:#999;
					font-size: 24rpx;
				}
			}
			.g_rate{
				background: rgb(55, 0, 63);
				display: flex;
				justify-content: center;
				padding:8rpx 0;
				color:#fff;
				font-size: 12px;
			}
			.mask_bg{		
				position: absolute;
				width: 100%;
				height: 100%;
				background: rgba(0, 0, 0, 0.4);
				top: 0;
				left: 0;
				display: flex;
				align-items: center;
				justify-content: center;
				
			}
			.g_level{
				position:absolute;
				left:0; top:10rpx; z-index: 20;
				&.g_level_text{
					background: #FF0000;
					font-size: 24rpx;
					padding:10rpx;
					color:#fff;
					border-top-right-radius: 10rpx;
					border-bottom-right-radius: 10rpx;
					overflow: hidden;
				}
			}
			.g_nums{
				position: absolute;
				bottom: 0;
				background: rgb(153, 141, 246);
				color:#fff;
				width: 100%;
				font-size: 12px;
				display: flex;
				justify-content: center;
				padding:8rpx 0;
			}
		}
		.level_data{
			width: 31%;
			margin-right:3%;
			background:#fff;
			border-radius: 10rpx;
			padding:15rpx 10rpx;
			margin-bottom:20rpx;
			position: relative;
			&:nth-child(3n){
				margin-right: 0;
			}
			.level_nums,.level_rate{
				display: flex;
				text-align: right;
				justify-content: end;
				color:#999;
				font-size: 26rpx;
				height: 42rpx;
				line-height: 42rpx;
				view{ color:#333 }
			}
			.level_tit{ position: absolute; left: 10rpx; top:10rpx;}
		}
		
	}
	.view_pages{
		margin: 20rpx 30rpx;
		display: flex;
		justify-content: space-between;
		font-size: 22rpx;
		position: relative;
		z-index: 40;
		margin-top: -110px;
	}
	.view_pages2{
		width: 100%;
		margin: 0rpx 30rpx 20rpx;
		display: flex;
		justify-content: space-between;
		font-size: 22rpx;
	}
	.view_page_total,.view_goods_total{ display: flex; align-items: center; }
	.wind-list {
		height: 246rpx;
		margin: 0 auto;
		box-sizing: border-box;
		padding-top: 24rpx;
	}

	.header-view {
		position: relative;
		width: 100%;
		height: 424px;
		background-image: url('https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240908/b4287209df0a33d9ee046865de404038.png');
		background-size: auto 332px;
		background-position: bottom -50px center;
		background-repeat: no-repeat;
		padding-bottom: 80px;
		box-sizing: content-box;
		.music-view {
			width: 80rpx;
			height: 80rpx;
			position: absolute;
			top: 60rpx;
			right: 30rpx;
			z-index: 100;
			image {
				width: 100%;
				height: 100%;
			}
		}
		.h-v-title {
			// background-color: red;
			overflow: hidden;
			margin: 30rpx 30rpx 60rpx;
			position: relative;
			.h-v-title-0 {
				width: 100%;
				height: 170rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			.choujiang-btn {
				width: 110rpx;
				height: 90rpx;
				position: absolute;
				top: 50rpx;
				left: 20rpx;
				z-index: 100;
				image {
					width: 100%;
					height: 100%;
				}
			}

			.music-view {
				width: 60rpx;
				height: 60rpx;
				position: absolute;
				top: 60rpx;
				right: 30rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}

			
		}
	}
	.h-v-title {
		// background-color: red;
		overflow: hidden;
		margin: 30rpx 30rpx 0rpx;
		position: relative;
		font-size:16px;
		.h-v-title-0 {
			width: 100%;
			height: 170rpx;
	
			image {
				width: 100%;
				height: 100%;
			}
		}
		.h-v-title-1 {
			display: flex;
			justify-content: center;
			// align-items: center;
			color: #000;
			font-size: 36rpx;
		
			.c-item-title {
				font-size:16px;
				padding: 0 10rpx;
				box-sizing: border-box;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				
			}
		}
		.g-info-price{
			margin-top:20rpx;
			color: #FF0000;
			font-size: 32rpx;
			text-align: center;
		}
	}
	.box_buydata1{
		display: flex;
		padding:0 10px;
		.buy_fangan{
			background: #ddd;
			border-radius: 10rpx;
			margin:0 10rpx 10rpx 0;
			padding:8rpx 16rpx;
			&.active{ background: #0079fe; color:#fff; }
		}
	}
	.dialog_opeate{
		display: flex; justify-content: space-around;
		margin-top:-220rpx;
	}
	.choujiang-btn{
		border-radius: 50%;
		overflow: hidden;
		background: #040005;
		position: fixed;
		left: 6rpx;
		top: 700rpx;
		width: 100rpx; 
		height:100rpx;
		z-index: 8;
		image{ width: 100%; height:100% }
	}
	.music-view{
		border-radius: 50%;
		overflow: hidden;
		width: 100rpx; 
		height:100rpx;
		z-index: 8;
		image{ width: 100%; height:100% }
	}
	.banner {
		height: 230px;
		width: 100%;
		// background-color: red;
		margin: 0 auto;
		position: relative;
		.boxInfo_img{
			height: 230px;
			width: 100%;
			display: flex;
			justify-content: center;
			image{ width:100%; height: 100%; }
		}
	}
	.g-info-price{
		color: #fff;
		font-size: 15px;
		text-align: center;
		background:rgba(0,0,0,0.6);
		display:block;
		width: 120px;
		margin:0 auto;
		border-radius: 5px;
		padding:6px;
		margin-top:12px;
	}
	.scroll-card {
		width: 690rpx;
		height: 300rpx;
		margin: 0 auto;
		background-image: url('https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240909/228cbb8775e12c825061584bb33803d5.png');
		background-size: 100% 100%;
		margin-bottom: 30rpx;
		overflow: hidden;
		.scroll-card-title {
			color: #fff;
			text-align: left;
			font-size: 20rpx;
			font-weight: bold;
			line-height: 50rpx;
			height: 50rpx;
			background-image: url('https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240909/031f4b02b25d5f5c08d563f49f3c2eb5.png');
			background-size: auto 100%;
			background-repeat: no-repeat;
			margin: 20rpx 20rpx 0;
			padding-left: 30rpx;
		}

		.scroll-card-view {
			height: 100%;
			width: 100%;
			padding: 20rpx;
			box-sizing: border-box;
			// padding: 50rpx 20rpx;
			box-sizing: border-box;

			.c-item-banner {
				// height: 78rpx;
				width: 100%;
				display: flex;
				white-space: nowrap;

				.swiper-view {
					height: 180rpx;
					width: 690rpx;
				}

				&-box {
					width: 140rpx;
					height: 180rpx;
					display: block;
					margin-left: 20rpx;
					overflow: hidden;
					background-image: url('https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240909/3a298b89581509d73fe4f42d811f168e.png');
					background-size: 100% 100%;
					flex-shrink: 0;
					display: flex;
					flex-direction: column;
					align-items: center;
					justify-content: center;

					image {
						width: 120rpx;
						height: 120rpx;
						border-radius: 10rpx;
						background: #fff;
					}

					text {
						color: #fff;
						font-size: 22rpx;
						font-weight: 600;
						margin-top: 10rpx;
					}
				}
			}
		}
	}

	.banner-box-view {
		width: 100%;
		height: 180rpx;
		display: flex;
	}

	.bottom-vh {
		height: calc(220rpx + constant(safe-area-inset-bottom));
		height: calc(220rpx + env(safe-area-inset-bottom));
	}
	.bottom-view-footer{
		position: fixed;
		bottom: 0;
		width: 100%;
		z-index: 1000;
	}
	.bottom-view {
		// background: #FFFFFF;
		// border: 1px solid #EEEEEE;
		padding-bottom: constant(safe-area-inset-bottom);
		/* 兼容 iOS < 11.2 */
		padding-bottom: env(safe-area-inset-bottom);
		/* 兼容 iOS >= 11.2 */
		display: flex;
		justify-content: space-between;
		padding: 0 30rpx;
		align-items: center;
		width: 100%;
		box-sizing: border-box;
		box-sizing: border-box;
		.bottom-view-center {
			font-size: 28rpx;
			font-weight: 300;
			color: #FFFFFF;
			width: 170rpx;
			height: 70rpx;
			background: #1E1E1E;
			border-radius: 35rpx;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.bottom-view-btn {
			width: 31%;
			height: 80rpx;
			position: relative;
			display: flex;
			justify-content: center;
			align-items: center;
			line-height: 80rpx;
			color:#fff;
			border-radius: 10rpx;
			image {
				width: 100%;
				height: 100%;
				position: absolute;
			}
			.text-title {
				position: absolute;
				width: 100%;
				top: 75rpx;
				text-align: center;
				font-size: 26rpx;
				font-family: 600;
				color: #fff;
			}
			.text-prcie {
				position: absolute;
				width: 100%;
				bottom: 60rpx;
				text-align: center;
				font-size: 26rpx;
				font-family: 600;
				color: #fff;
			}
		}
	}
	.bottom-btn{
		margin: 30rpx;
		display: flex;
		justify-content: space-between;
		border-radius: 10rpx;
		.btn_random{
			width: 100%; display: flex; justify-content: center; align-items: center; 
			height:84rpx;
			background: #000;
			border-radius: 10rpx;
		}

	}
	.orderbox {
		background-color: #fff;
		z-index: 999;

		.tit {
			text-align: center;
			padding: 30rpx 0;
			font-size: 32rpx;
		}

		.goods image {
			width: 150rpx;
			height: 150rpx;
			flex-shrink: 0;
		}

		.rowitem {
			padding: 20rpx 0;
		}

		.rowitem image {
			width: 45rpx;
			height: 45rpx;
			margin-right: 10rpx;
		}

		.rowitem .l {
			display: flex;
			align-items: center;
			color: #222;
		}

		.total {
			border-top: 1rpx solid #e5e5e5;
			text-align: right;
			font-weight: bold;
			padding: 30rpx 0 10rpx;
		}

		.total text {
			color: #d81e06;
			font-size: 32rpx;
		}

		.payrow {
			/* width: 670rpx; */
			display: flex;
			align-items: center;
			justify-content: space-between;
		}


		.tit {
			text-align: center;
			padding: 0;
			font-size: 32rpx;
		}

		.con {
			padding: 20rpx;
			box-sizing: border-box;
			min-height: 300rpx;

		}

		.con .box1 {
			padding: 20rpx;
			box-sizing: border-box;
		}

		.goods image {
			width: 150rpx;
			height: 150rpx;
			flex-shrink: 0;
		}

		.goods .info {
			padding-top: 10rpx;
			width: 90%;
			margin-left: 30rpx;
		}

		.goods .info .t {
			font-size: 34rpx;
		}

		.goods .info .two {
			display: flex;
			justify-content: space-between;
			margin-top: 20rpx;
		}

		.goods .info .two .price {
			font-size: 30rpx;
			font-weight: bold;
		}

		.goods .info .two .num {
			color: #999;
		}

		.total {
			border-top: 1rpx solid #e5e5e5;
			text-align: right;
			font-weight: bold;
			padding: 10rpx 0 10rpx;
		}

		.total text {
			color: #d81e06;
			font-size: 32rpx;
		}

		.payrow {
			/* width: 670rpx; */
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 20rpx 0 !important;
		}

		.obtm {
			padding: 20rpx;
			box-sizing: border-box;
			padding-bottom: calc(constant(safe-area-inset-bottom) + 30rpx);
			padding-bottom: calc(env(safe-area-inset-bottom) + 30rpx);
			.pay_tips{
				text-align: center;
				margin-bottom:10rpx;
			}
			.pay_tips{
				text-align: center;
				margin-bottom:10rpx;
			}
		}

		.obtm button {
			background-color: #00fdeb;
			color: #000;
		}

		.obtm button text {
			font-weight: bold;
		}

		.xieyi {
			width: 690rpx;
			margin: 0 auto;
			margin-top: 20rpx
		}

		.order-hearder {
			width: 100%;
			padding: 30rpx;
			display: flex;
			align-items: center;
			color: #222;
			padding: 30rpx;
			box-sizing: border-box;

			.order-hearder-0 {
				width: 160rpx;
				height: 160rpx;
				flex-shrink: 0;

				image {
					width: 140rpx;
					height: 140rpx;
				}
			}

			.order-hearder-1 {
				width: 100%;

				.hearder-1-title {
					width: 500rpx;
					font-size: 26rpx;
					box-sizing: border-box;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
				}

				.hearder-1-price {
					font-size: 24rpx;
					font-weight: 400;
					margin-top: 20rpx;
					display: flex;
					justify-content: space-between;
					align-items: center;
					.hearder-1-price-0{ color:#FF0000; font-size: 32rpx; }
					.hearder-1-price-2 {
						font-size: 26rpx;
					}
				}
			}
		}
	}
	.pk_list{
		width: 100%;
		background: rgb(55, 0, 63);;
		border-radius: 20rpx;
		padding: 20rpx;
		margin-bottom:30rpx;
		position: relative;
		.pk_result{
			position: absolute;
			width: 80rpx; height:80rpx; top: 15rpx;
			z-index: 20;
		}
		.pk_result_left{
			left:15%
		}
		.pk_result_right{
			right:15%
		}
		.pk_header{
			margin-top: 24rpx;
			position: relative;
			.u-img{
				position: absolute;
				width: 80rpx; height:80rpx;
				left: 0;
				border-radius: 8rpx;
			}
			.pk_left_member,.pk_right_member{
				position: absolute;
				top: 42rpx;
				left: 28rpx;
				width: 33%;
				display: block;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
				height:80rpx;
				line-height: 80rpx;
				padding-left:85rpx;
				color:#fff;
				.pk_result{
					position: absolute;
					width: 80rpx;
				}
			}
			.pk_right_member{
				right:28rpx;
				left:unset;
				padding-left:unset;
				padding-right:85rpx;
				.u-img{
					position: absolute;
					width: 80rpx; height:80rpx;
					left:unset; right: 0;
					border-radius: 8rpx;
				}
			}
			
		}
		.mask-img{ width: 100%; height: 90px; }
		.pk_create,.pk_num{ line-height: 50rpx; text-align: center; color:#fff; }
		.zj_list{
			display: flex;
			justify-content: space-between;
			.side_left,.side_right{
				width: 48%;
				display: flex;
				border:1px solid #ddd;
				margin:15rpx 0;
				padding:15rpx;
				border-radius: 10rpx;
				color:#fff;
				image{ width:80rpx; height:80rpx; flex-shrink: 0; }
				.goods_title{ 
					width: 100%;
					color:#fff; margin-left:10rpx;
					display: block;
					overflow: hidden;
					height:48px;
					.g_title{
						width: 100%;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
						display: block;
						height:24px;
					}
					.g_level{
						color:#FF0000;
						font-size:13px;
						font-weight:bold;
						display: block;
						width:100%;
						height:24px;
					}
				}
			}
		}
		.pk_operate{
			display: flex;
			justify-content: space-between;
			margin-top: 10rpx;
			border-top: 1px solid #ccc;
			padding-top: 10rpx;
			.pk_operate_left,.pk_operate_right{
				display: flex;
				align-items: center;
				color: #fff;
			}
			.user_info{
				display: flex;
				align-items: center;
				.u-img{ width: 80rpx; height: 80rpx; }
			}
			 .pk_operate_left{
			 	.u-img{ margin-right: 10rpx; }
			 }
			.pk_operate_right{
				.u-img{ margin-left: 10rpx; }
			}
			.btn_add{
				display: flex;
				align-items: center;
				height: 100%;
			}
		} 
		
	}
	.pay_model_select{
		display: flex;
		justify-content: flex-start;
		align-items: center;
		padding: 20rpx;
		image{
			margin-right:10rpx;
		}
	}
	.fahuo-time {
		width: 100%;
		text-align: center;
		font-size: 24rpx;
		font-weight: 400;
		color: #f2a93b;
		margin-top: 20rpx;
	}

	.free-play {
		width: 120rpx;
		height: 120rpx;
		// background-color: red;
		position: absolute;
		right: 50rpx;
		bottom: 0;
		z-index: 2;

		.free-play-bg {
			width: 120rpx;
			height: 120rpx;
			animation: xuanzhuan 3s linear infinite;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.free-play-img {
			width: 80rpx;
			height: 80rpx;

			image {
				width: 100%;
				height: 100%;
			}

			position: relative;
			top:-90rpx;
			left:20rpx
		}
	}


	@-webkit-keyframes xuanzhuan {
		0% {
			transform: rotate(0deg);
		}

		25% {
			transform: rotate(90deg);
		}

		50% {
			transform: rotate(180deg);
		}

		75% {
			transform: rotate(270deg);
		}

		100% {
			transform: rotate(360deg);
		}
	}

	.syouhui {
		// background-color: #fff;
		background-color: #10141d;
		color: #fff;
	}

	.youtit {
		padding: 20rpx 0;
		display: flex;
		position: relative;
	}

	.youtit .back {
		padding: 0 20rpx;
		position: absolute;
	}

	.youtit .youhuit {
		font-size: 34rpx;
		text-align: center;
		width: 100%;
	}

	.youhuicon {
		// background-color: #F4F8FB;
		background-color: #10141d;
		/* min-height: 900rpx; */
		padding: 20rpx;
		box-sizing: border-box;
	}

	.youhuicon .shitu {
		height: 670rpx;
	}

	.youhuicon .shitu .couList {
		display: flex;
		height: 160rpx;
		border-radius: 6rpx;
		overflow: hidden;
		margin-bottom: 20rpx;
		border: 1px solid #00fdeb;
	}

	.youhuicon .shitu .couList .l {
		flex-shrink: 0;
		width: 160rpx;
		height: 160rpx;
		background-color: #00fdeb;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.youhuicon .shitu .couList .l .aa {
		font-size: 30rpx;
		color: #fff;
	}

	.youhuicon .shitu .couList .l .pri {
		font-size: 46rpx;
		color: #fff;
	}

	.youhuicon .shitu .couList .l .tiao {
		color: #fff;
		text-align: center;
		font-size: 24rpx;
	}

	.youhuicon .shitu .couList .r {
		// background-color: #fff;
		width: 100%;
		padding: 20rpx;
		height: 160rpx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.youhuicon .shitu .couList .r .ll .t {
		font-size: 32rpx;
	}

	.youhuicon .shitu .couList .r .use {
		margin: 8rpx 0;
	}

	.youhuicon .shitu .couList .r .qi {
		font-size: 24rpx;
		color: #999;
	}

	.youhuicon .btn {
		width: 100%;
		text-align: center;
		color: #fff;
		line-height: 80rpx;
		background-color: #00fdeb;
		font-size: 32rpx;
		margin-top: 20rpx;
		border-radius: 6rpx;
	}

	@keyframes bLine {
		0% {
			transform: translateY(0);
		}

		50% {
			transform: translateY(10px);
		}

		100% {
			transform: translateY(0);
		}
	}

	.luck-view {
		height: 86vh;
		background-color: #151515;
		padding: 30rpx;
		box-sizing: border-box;

		.luck-view-title {
			display: flex;
			justify-content: space-between;
			padding-bottom: 30rpx;

			.lvt-left {
				&-0 {
					color: #fff;
					font-size: 36rpx;
				}

				&-1 {
					color: #999999;
					font-size: 24rpx;
					margin-top: 24rpx;
				}
			}

			.lvt-right {
				color: #999999;
				font-size: 68rpx;
			}
		}

		.luck-view-type {
			display: flex;

			.type-tag {
				padding: 20rpx 40rpx;
				flex-shrink: 0;
				border: 1px solid #999;
				color: #fff;
				margin-right: 30rpx;
				font-size: 26rpx;
			}

			.type-tag-active {
				border: 1px solid #00fdeb
			}
		}

		.log-list-view {
			overflow: hidden;
			height: calc(86vh - 300rpx);
			margin-top: 30rpx;

			&-cell {
				width: 100%;
				height: 130rpx;
				margin-bottom: 30rpx;
				border: 1px solid #fff;
				color: #fff;
				display: flex;
				justify-content: space-between;
				padding: 0 20rpx;
				box-sizing: border-box;

				.log-cell-left {
					display: flex;
					align-items: center;

					&-1 {
						width: 100rpx;
						height: 100rpx;
						overflow: hidden;
						flex-shrink: 0;

						image {
							width: 100%;
							height: 100%;
						}
					}

					&-2 {
						margin-left: 20rpx;
						overflow: hidden; //超出的文本隐藏

						&-1 {
							font-size: 28rpx;
							font-weight: bold;
							color: #70c2ed;
						}

						&-2 {
							font-size: 24rpx;
							color: #999;
							margin-top: 16rpx;
							width: 300rpx;
							overflow: hidden;
							white-space: nowrap;
							text-overflow: ellipsis;
							-o-text-overflow: ellipsis;
						}
					}
				}

				.log-cell-right {
					display: flex;
					align-items: center;

					&-1 {
						width: 70rpx;
						height: 70rpx;
						border-radius: 50%;
						overflow: hidden;
						flex-shrink: 0;

						image {
							width: 100%;
							height: 100%;
						}
					}

					&-2 {
						font-size: 24rpx;
						margin-left: 20rpx;
						width: 100rpx;
						overflow: hidden;
						white-space: nowrap;
						text-overflow: ellipsis;
						-o-text-overflow: ellipsis;
					}
				}
			}
		}
	}

	.newPeopleBox {
		width: 690rpx;
		height: 900rpx;
		overflow: hidden;
		position: relative;
	}

	.newPeopleBox,
	.box11 {
		.newmainBox {
			background: url('https://img.alicdn.com/imgextra/i2/2215984279448/O1CN01X1Za8P2JfEtfHa4D9_!!2215984279448.png') no-repeat;
			background-size: 100% 100%;
			width: 690rpx;
			padding-top: 260rpx;
			height: 800rpx;
			box-sizing: border-box;
		}

		.youhuilist {
			width: 550rpx;
			height: 480rpx;
			margin: 0 auto;
		}

		.newmainBox .youhuibox {
			background: url('https://img.50api.cn/dingdang/youhui.png') no-repeat;
			background-size: 550rpx 157rpx;
			width: 550rpx;
			height: 157rpx;
			margin: 20rpx auto;
			display: flex;
			justify-content: space-between;
		}

		.newmainBox .youhuibox .left {
			display: flex;
			align-items: center;
			color: #255470;
			padding-left: 20rpx;
		}

		.newmainBox .youhuibox .left .name {
			font-size: 34rpx;
			margin-bottom: 10rpx;
			color: #255470;
		}

		.newmainBox .youhuibox .left .price1 {
			color: #255470;
			font-size: 28rpx;
		}

		.newmainBox .youhuibox .left .price1 .pri {
			font-weight: 700;
			font-size: 36rpx;
			color: #255470;
			vertical-align: -6%;
			margin-right: 8rpx;
		}

		.newmainBox .youhuibox .right {
			width: 160rpx;
			height: 156rpx;
			flex-shrink: 0;
			display: flex;
			align-items: center;
			justify-content: center;
			text-align: center;
		}

		.newmainBox .youhuibox .right .ling {

			border-radius: 50rpx;
			width: 120rpx;
			border-radius: 10rpx;
			text-align: center;
			line-height: 45rpx;
		}

		.newmainBox .youhuibox .right .active {
			background-color: #60E0E1;
			color: #fff;
		}

		.newmainBox .youhuibox .right .yiling {
			background-color: #9d9d9d;
			color: #fff;
		}

		.newmainBox .youhuibox .right .price {
			font-size: 28rpx;
			color: #fff;
			margin-bottom: 10rpx;
			font-weight: 700;
		}

		.newmainBox .youhuibox .right .price text {
			font-size: 46rpx;
			color: #fff;
		}

		.btm-2 {
			width: 750rpx;
			position: relative;
			top: -100rpx;
		}

		.btm-2 .btmBg {
			width: 750rpx;
			position: absolute;
			top: 0;
			left: 0;
		}

		.btm-2 .btn1 {
			width: 690rpx;
			position: absolute;
			top: 80rpx;
			left: 0;
			text-align: center;
		}

		.btm-2 .btn1 image {
			width: 350rpx;
			display: inline-block;
		}

		.off {
			text-align: center;
			// margin-top: 50rpx;
			position: absolute;
			right: 0rpx;
			top: 0rpx;
		}

		.off image,
		.off image,
		.tanBox .off image {
			width: 70rpx;
			height: 70rpx;
			display: inline-block;
		}

		.daojubox {
			background: url('https://img.50api.cn/dingdang/qo.png') no-repeat;
			background-size: 100%;
			width: 650rpx;
			height: 980rpx;
			padding: 30rpx;
			padding-top: 60rpx;
			box-sizing: border-box;
		}

		.daojubox .top {
			display: flex;
			justify-content: space-between;
			align-items: center;
		}

		.daojubox .top image {
			width: 350rpx;
		}

		.daojubox .rulebox {
			color: #164367;
		}

		.daojubox .rulebox .wen {
			border-radius: 50%;
			color: #164367;
			border: 4rpx solid #164367;
			width: 40rpx;
			height: 40rpx;
			line-height: 36rpx;
			text-align: center;
			font-weight: bold;
			display: inline-block;
			margin-right: 10rpx;
		}

		.nodata {
			height: 680rpx;
			text-align: center;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.nodata image {
			width: 340rpx;
			height: 340rpx;
		}

		.nodata .tit {
			font-size: 34rpx;
			margin: 20rpx 0;
		}

		.nodata .fun {
			font-size: 28rpx;
			color: #999;
		}

		.cardList .list {
			background-color: #fff;
			margin-bottom: 20rpx;
			padding: 20rpx;
			box-sizing: border-box;
			width: 100%;
		}

		.cardList .list .goods .picbox {
			background-color: #F1F2F6;
			width: 150rpx;
			height: 150rpx;
			padding: 20rpx;
			box-sizing: border-box;
			flex-shrink: 0;
		}

		.cardList .list .goods .picbox image {
			width: 100%;
			height: 100%;
		}

		.cardList .textbox {
			margin-left: 20rpx;
			width: 100%;
		}

		.cardList .textbox .tit {
			font-size: 32rpx;
		}

		.cardList .textbox .two {
			font-size: 28rpx;
			margin-top: 10rpx;
		}

		.cardList .textbox .qi {
			color: #999;
			font-size: 24rpx;
			margin-top: 10rpx;
		}

		.cardList .list .tip1 {
			color: #999;
			font-size: 24rpx;
			margin-top: 10rpx;
			line-height: 1.3;
		}

		.explain .tit {
			background-image: linear-gradient(#afc5f3, #94a0e4);
			font-size: 32rpx;
			display: inline-block;
			font-weight: bold;
			padding: 6rpx 15rpx;
			color: #333;
			margin-top: 15rpx;
		}

		.explain .tit text {
			margin: 0 10rpx;
		}

		.explain .btm {
			/* background-color: #fff; */
			text-align: center;
			padding-top: 30rpx;
		}

		.explain .btm .btn2 {
			display: inline-block;
			background-color: #a5b0e1;
			padding: 25rpx 80rpx;
		}

		.explain .text {
			color: #999;
			font-size: 24rpx;
		}

		.vbox {
			background-color: #fff;
			width: 650rpx;
			padding: 10rpx;
			box-sizing: border-box;
		}

		.vbox .v {
			width: 100%;
		}

		.vbox .btm {
			padding: 20rpx 0;
		}

		.vbox .btm button {
			background-color: #2ceaff;
			width: 50%;
		}

		.orderbox {
			background-color: #fff;
			z-index: 999;
		}

		.orderbox .tit {
			text-align: center;
			padding: 30rpx 0;
			font-size: 32rpx;
		}

		.orderbox .con {
			background-color: #F3F4F8;
			padding: 20rpx;
			box-sizing: border-box;
			min-height: 800rpx;
		}

		.orderbox .con .box1 {
			padding: 20rpx;
			box-sizing: border-box;
			background-color: #fff;
		}

		.orderbox .goods image {
			width: 150rpx;
			height: 150rpx;
			flex-shrink: 0;
		}

		.orderbox .goods .info {
			padding-top: 10rpx;
			width: 90%;
			margin-left: 30rpx;
		}

		.orderbox .goods .info .t {
			font-size: 34rpx;
		}

		.orderbox .goods .info .two {
			display: flex;
			justify-content: space-between;
			margin-top: 20rpx;
		}

		.orderbox .goods .info .two .price {
			font-size: 30rpx;
			font-weight: bold;
		}

		.orderbox .goods .info .two .num {
			color: #999;
		}

		.orderbox .rowitem {
			padding: 20rpx 0;
		}

		.orderbox .rowitem image {
			width: 45rpx;
			height: 45rpx;
			margin-right: 10rpx;
		}

		.orderbox .rowitem .l {
			display: flex;
			align-items: center;
			color:#222;
		}

		.orderbox .total {
			border-top: 1rpx solid #e5e5e5;
			text-align: right;
			font-weight: bold;
			padding: 30rpx 0 10rpx;
		}

		.orderbox .total text {
			color: #d81e06;
			font-size: 32rpx;
		}

		.orderbox .payrow {
			/* width: 670rpx; */
			display: flex;
			align-items: center;
			justify-content: space-between;
		}

		.orderbox .obtm {
			padding: 20rpx;
			box-sizing: border-box;
			background-color: #fff;
		}

		.orderbox .obtm button {
			background-color: #70DDE0;
		}

		.orderbox .obtm button text {
			font-weight: bold;
		}

		.orderbox .xieyi {
			width: 690rpx;
			margin: 0 auto;
			padding: 10rpx 0;
			padding-bottom: calc(constant(safe-area-inset-bottom));
			padding-bottom: calc(env(safe-area-inset-bottom));
		}

		.syouhui {
			background-color: #fff;
		}

		.youtit {
			padding: 20rpx 0;
			display: flex;
			position: relative;
		}

		.youtit .back {
			padding: 0 20rpx;
			position: absolute;
		}

		.youtit .youhuit {
			font-size: 34rpx;
			text-align: center;
			width: 100%;
		}

		.youhuicon {
			background-color: #F4F8FB;
			/* min-height: 900rpx; */
			padding: 20rpx;
			box-sizing: border-box;
		}

		.youhuicon .shitu {
			height: 670rpx;
		}

		.youhuicon .shitu .couList {
			display: flex;
			height: 160rpx;
			border-radius: 6rpx;
			overflow: hidden;
			margin-bottom: 20rpx;
		}

		.youhuicon .shitu .couList .l {
			flex-shrink: 0;
			width: 160rpx;
			height: 160rpx;
			background-color: #63D7D6;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.youhuicon .shitu .couList .l .aa {
			font-size: 30rpx;
			color: #fff;
		}

		.youhuicon .shitu .couList .l .pri {
			font-size: 46rpx;
			color: #fff;
		}

		.youhuicon .shitu .couList .l .tiao {
			color: #fff;
			text-align: center;
			font-size: 24rpx;
		}

		.youhuicon .shitu .couList .r {
			background-color: #fff;
			width: 100%;
			padding: 20rpx;
			height: 160rpx;
			box-sizing: border-box;
			display: flex;
			align-items: center;
			justify-content: space-between;
		}

		.youhuicon .shitu .couList .r .ll .t {
			font-size: 32rpx;
		}

		.youhuicon .shitu .couList .r .use {
			margin: 8rpx 0;
		}

		.youhuicon .shitu .couList .r .qi {
			font-size: 24rpx;
			color: #999;
		}

		.youhuicon .btn {
			width: 100%;
			text-align: center;
			color: #fff;
			line-height: 80rpx;
			background-color: #63D7D6;
			font-size: 32rpx;
			margin-top: 20rpx;
			border-radius: 6rpx;
		}

		.luckbox {
			background: url('https://img.50api.cn/dingdang/luckbg.png') no-repeat;
			background-size: 100%;
			border-radius: 24rpx;
			box-sizing: border-box;
			padding: 30rpx;
			width: 650rpx;
			background-color: #fff;
		}

		.luckbox .top {
			justify-content: space-between;
			display: flex;
			align-items: center;
		}

		.luckbox .titpic {
			width: 50%;
		}

		.luckbox .goodsPic {
			width: 45%;
			position: relative;
			/* top: -80rpx; */
		}

		.luckbox .option {
			padding: 20rpx 0;
		}

		.luckbox .option .row {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
		}

		.luckbox .option .row .chou {
			background: url('https://img.50api.cn/dingdang/rx.webp') no-repeat;
			background-size: 100%;
			width: 50%;
			display: flex;
			align-items: center;
			text-align: center;
			height: 124rpx;
			margin: 15rpx 0;
			position: relative;
		}

		.jian {
			position: absolute;
			background-color: #FFEAE5;
			font-size: 22rpx;
			color: #E54E20;
			padding: 2rpx 20rpx;
			border: 1rpx solid #E6A793;
			border-top-right-radius: 40rpx;
			border-bottom-right-radius: 40rpx;
			top: -20rpx;
			left: 10rpx;
		}

		.yuanj {
			font-size: 24rpx;
			color: #077C8B;
			text-decoration: line-through;
			margin-left: 5rpx;
		}

		.luckbox .option .row .chou .b {
			width: 100%;
		}

		.luckbox .option .row .chou .tit {
			font-size: 32rpx;
			margin-bottom: 6rpx;
		}

		.luckbox .option .shi {
			background: url('https://img.50api.cn/dingdang/rw.webp');
			height: 124rpx;
			text-align: center;
			background-size: 100% 124rpx;
			display: flex;
			align-items: center;
			margin-top: 15rpx;
			position: relative;
		}

		.luckbox .option .shi .b {
			width: 100%;
		}

		.ouhuang {
			background: url('https://xgmh.hui-xiang.cn/assets/img/pk.png') no-repeat;
			background-size: 100%;
		}

		.ouhuang .scroll {
			height: 920rpx;
			margin-top: 80rpx;
		}

		.ouhuang .scroll .listbox {
			padding: 0 30rpx;
			box-sizing: border-box;
		}

		.ouhuang .scroll .listbox .list {
			margin-bottom: 20rpx;
		}

		.ouhuang .scroll .listbox .picbox {
			position: relative;
		}

		.ouhuang .scroll .listbox .picbox image {
			width: 100%;
			height: 350rpx;
		}

		.ouhuang .scroll .listbox .picbox .text {
			padding: 0 20rpx;
			line-height: 80rpx;
			background-color: rgba(255, 255, 255, 0.8);
			position: absolute;
			left: 0;
			bottom: 0;
			width: 100%;
		}

		.tong {
			position: fixed;
			left: 0;
			top: 220rpx;
			width: 750rpx;
			background-size: 100% 100% !important;
			height: 80rpx;
			background-repeat: no-repeat !important;
			/* #ifdef H5 */
			top: 150rpx;
			/* #endif */
		}

		.tong .text {
			/* width: 550rpx; */
			padding: 0 30rpx;
			padding-right: 120rpx;
			box-sizing: border-box;
		}

		.tong image {
			position: absolute;
			width: 100rpx;
			right: 50rpx;
			top: -40rpx;
		}

		.tanBox {
			width: 600rpx;
			text-align: center;
		}

		.tanBox .pic image {
			width: 100%;
		}

	}

	.positionFiex {
		width: 110rpx;
		height: 100rpx;
		z-index: 8;
	}
	.tiploginShow-view{
			width: 500rpx;
			background-color: #fff;
			border-radius: 30rpx;
			padding: 30rpx;
			box-sizing: border-box;
			.tiploginShow-view-0{
				text-align: center;
				font-size: 32rpx;
				color: #131313;
			}
			.tiploginShow-view-1{
				text-align: center;
				font-size: 24rpx;
				margin-top: 20rpx;
				color: #2c2c2c;
			}
			.tiploginShow-view-2{
				width: 400rpx;
				height: 80rpx;
				background-color: #0079fe;
				color: #FFFFFF;
				display: flex;
				justify-content: center;
				align-items: center;
				margin: 40rpx auto 20rpx;
			}
			.tiploginShow-view-3{
				text-align: center;
			}
		}
	.model_title{     
		height: 84rpx;
		line-height: 84rpx;
		background: #1a162d;
		text-align: center;
		color: #fff;
		font-size: 15px;
		position: absolute;
		top: 0;
		width: 100%;
		z-index: 999;
	}
	.model_content{
		background: #000;
		padding:10px;
		height: 100%;
		overflow-y: scroll;
		padding-top: 110rpx;
		.model_glv{
			display: flex;
			justify-content: center;
			color:#00fdeb;
			.mh_rate_li{ padding:0 15px; text-align: center; }
		}
		.mh_goods{
			background: #1a162d;
			border-radius: 8px;
			margin-top: 10px;
			color:#eee;
			display: flex;
			padding: 10px;
			.mh_img{ 
				position: relative;
				width: 90px; height:90px; margin-right: 10px;
				.icon-img{
					position: absolute;
					left: 0;
					bottom: 0;
				}
			}
			.mh_text{
				position: relative;
				.mh_price{
					color: #00fdeb;
					display: flex;
					align-items: baseline;
					position: absolute;
					bottom: 5px;
					.mh_price_num{ font-size: 18px;  }
				}
			}
			
		}
	}
	.scroll-temp {
		font-size: 20px;
		height: 215rpx;
		line-height: 30px;
		overflow: hidden;
		.temp-box {
			white-space: nowrap;
			.li {
				position: relative;
				display: inline-block;
				height: 68rpx;
				width: 344rpx;
				overflow: hidden;
				left: 20px;
				background: url("https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240910/590cfbf7c7050b208c2ded501fa59b0c.png") no-repeat;
				background-size: auto 100%;
				&.li0{
					top:78px;
					left: -30px;
					
				}
				&.li2{
					top:70rpx;
					left: -20px;
				}
				.dm_view_img{
					position: absolute;
					width: 58rpx; height:58rpx; left: 4rpx; top:4rpx;
					image{ width: 100%; height:100% }
				}
				.dm_view_text{ padding-left:40px; font-size: 12px; color:#fff; padding-top:8rpx; 
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
					padding-right:7px;
				}
			}
	  }
	}
	.open_logs{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding:20rpx 0;
		margin-bottom:20rpx;
		background: url("https://v4mh6868.oss-cn-beijing.aliyuncs.com/uploads/20240913/09c46488ef971492c824b67a028506f0.png") no-repeat;
		background-size: 100% 100%;
		.u_name{
			    margin: 0 10px;
			    width: 190rpx;
			    overflow: hidden;
			    white-space: nowrap;
			    text-overflow: ellipsis;
			    flex-shrink: 0;
		}
		.u_goods_title{
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			flex-shrink: 0;
			width: 40%;
			color:#937bab;
			font-size:22rpx;
		}
		.u_img{ 
			width: 80rpx; height: 80rpx; flex-shrink: 0;
			.user-img{ width: 100%; height:100%; }
		}
		.u_goods_img{
			width: 110rpx; height:100rpx; flex-shrink: 0;
			.goods-img{ width: 100%; height:100%; }
		}
	}
</style>